/** 
  基地实习统计表 
*/
<template>
  <div>
      <condition-card @reset="resetSearch" @search="onSearch" label-position="right" label-width="150px">
        <el-row :gutter="24" style="height: 50px;">
        
          <el-col :span="8">
            <el-form-item :label="$t('practiceTable.year')">
              <el-date-picker
              v-model="queryForm.condition.year"
              type="year"
              value-format="yyyy"
              format="yyyy"
              :placeholder="$t('graduate.pleaseSelect')">
            </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="8">
              <el-form-item :label="$t('practiceTable.internship')">
               <el-input v-model="queryForm.condition.baseName"></el-input>
              </el-form-item>
          </el-col>
          <el-col :span="8">
              <el-form-item :label="$t('practiceTable.internshipLeve')">
                  <DictSelect v-model="queryForm.condition.baseLevel" :data="options.title" :plzSelect="true"></DictSelect>
              </el-form-item>
          </el-col>
        </el-row>
      </condition-card>
      <el-card shadow="never" v-loading="loading" body-style="padding: 24px;" class="card-margin">
        <h1 class="condition-title">{{$t('practiceTable.practice')}}</h1>
      
        <div class="edu-opertion-bar sub-title">
          <div class="float-right" style="display: flex;">
            <el-button style="margin-left:10px" type="primary" @click="exportFile">{{$t('internship.derive')}}</el-button>
            
          </div>
        </div>
        <edu-table :pagination="false" :order='false' :tooltipEffect="tooltipEffect" stripe :data="dataList" size="mini" @selection-change="handleSelectionChange">
          <edu-table-column :label="$t('practiceTable.year')" prop="year"></edu-table-column>
          <edu-table-column :label="$t('practiceTable.internship')" prop="baseName"></edu-table-column>
          <edu-table-column :label="$t('practiceTable.internshipLeve')" prop="baseLevel">
            <template slot-scope="scope">
              {{scope.row.baseLevel | collegeAcademyList(options.title)}}
           </template>
          </edu-table-column>
          <edu-table-column :label="$t('practiceTable.studentIntake')" prop="acceptPersonNum"></edu-table-column>
          <edu-table-column :label="$t('practiceTable.provided')" prop="needPersonNum"></edu-table-column>
        
        </edu-table>
        <el-row type="flex" class="row-bg" justify="end">
          <el-col>
              <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="queryForm.pageNum_"
                :page-sizes="[20, 40, 80, 100]"
                :page-size="queryForm.pageSize_"
                layout="total, sizes, prev, pager, next, jumper"
                :total="queryForm.total_"
                style="float:right;margin-top:10px"
              ></el-pagination>
          </el-col>
        </el-row>
      </el-card>
  </div>
</template>
<script>
import { queryDic } from "common/src/api/dictionary";
import UTILS from "common/src/utils/utils";
import graduateStudent from 'common/src/api/graduateStudent/graduateStudent';
import SelectTree2 from 'common/src/views/graduateStudent/component/SelectTree2';
export default {
  components: {
    SelectTree2: SelectTree2
  },
  data () {
    return {
      multipleSelection: [],
      queryForm: {
        pageNum_: 1,
        pageSize_: 20,
        total_: 0,
        condition:{
          year: "",
          baseName: "",
          baseLevel: ""
        }
      },
      dataList: [],
      options: {
        facultys: [],
        degreeType: [],
        title: [],
        sex: [],
      },
     
    }
  },
  filters: {
    collegeAcademyList(val, array) {
      let str = "";
      for (let item of array) {
        if (val == item.value) {
          str = item.label;
        }
      }
      return str;
    },
  },
  created() {
    this.getOptions();
    this.postInternshipSet(this.queryForm);
  },
  
  methods: {
    // 字典
    getOptions() {
      // 筛选条件字典查询
      let data = {
        lang: this.$store.getters.language || "cn",
        type: "allChild",
        keys: ["JDJB", "G_XZQY"]
      };
      queryDic(data).then(res => {
        UTILS.fillSelect(
          {
            title: "JDJB",
            degreeType: "G_XZQY",
          },
          res.data,
          this.options
        );
      });
    //  console.log(this.options);
     
    },
    // 轮询直到获取key值的接口返回
    cycleToGetKey() {
      setTimeout(() => {
        let currentIds = [];
        if (this.multipleSelection.length > 0) {
          this.multipleSelection.forEach((element) => {
            currentIds.push(element.id);
          });
        } else {
          this.dataList.forEach((element) => {
            currentIds.push(element.id);
          });
        }
        graduateStudent.specialist({
          "templateName": this.queryForm.condition.department,
          "baseLevel": this.queryForm.condition.proTitle,
          "isEnabled": this.queryForm.condition.isEnabled,
          "selectRowIds": currentIds
        }).then(res => {
          if (res.success) {
            this.$refs.downloadRef.close();
            this.exportButton = false;
            this.normalDelayRequest(res.key, res.msg);
          } else {
            this.cycleToGetKey();
          }
        });
      }, 3000);
    },
    // 导出异步
    delayRequest(key, name) {
      setTimeout(() => {
        graduateStudent.downloadGetKey(key, name).then(res => {
          this.exportResult = res.data;
          if (res.code == 200 && res.data.status) {
            this.exportButton = false;
            let path =
              '/api/practiceservice/export/file?path=' +
              res.data.path + '&name=' + name;
            // window.open(path);
            window.location.href = path;
            this.$message.success(this.$t('result.exportSuccessfully'));
            this.$refs.downloadRef.close();
          } else {
            this.delayRequest(key, name);
          }
        });
      }, 3000);
    },
    // Normal导出异步
    normalDelayRequest(key, name) {
      setTimeout(() => {
        graduateStudent.downloadGetKey(key).then(res => {
          this.exportResult = res.data;
          if (res.code == 200 && res.data.status) {
            this.exportButton = false;
            let path =
              '/api/practiceservice/export/file?path=' +
              res.data.path + '&name=' + name;
            // window.open(path);
            window.location.href = path;
            this.$message.success(this.$t('result.exportSuccessfully'));
            this.$refs.downloadRef.close();
          } else {
            this.delayRequest(key, name);
          }
        });
      }, 3000);
    },
    // 导出
    exportFile(command) {
      let list = JSON.parse(JSON.stringify(this.multipleSelection));
      if (list.length > 0) {
        list.forEach(el => {
          this.options.title.forEach(ele => {
            if (el.baseLevel == ele.value) {
              el.baseLevel = ele.label;
            }
          });
        });
      } else {
        list = [];
      }
      let obj = {
        practiceStatisticExcelVOList: list,
        practiceStatisticCondition: this.queryForm.condition
      };
      graduateStudent.exportPracticeStatisticList(obj).then(() => {
        this.$message(this.$t('internship.successfully'));
      });
      // 1、第一步：调该接口，获取key值以及msg中的文件名
      // 2、第二步：将key值放入接口传参
      // 3、第三步：传入path值以及name(msg中的文件名)值，下载文件
      // this.exportResult = null;
      // this.$refs.downloadRef.open();
      // this.exportButton = true;
      // this.cycleToGetKey();
      
    },
    // 学院选择
    collegeChange(val) {
      // this.options.profession = [];
      // <el-tag :type=" props.row.customizeReason == 1 ? 'success' : 'danger'" >{{props.row.customizeReason == 1 ? $t('abnormal.configed') : $t('abnormal.unConfiged')}}</el-tag>
      this.queryForm.majorList = [];
      if (val.length > 0) {

        let collegeList = val;
        graduateStudent.getDegreeByCollege(collegeList).then(res => {
          this.options.profession = res.data;
        });
      } else {
        this.options.profession = [];
      }
      // this.options["profession"] = [];
      //   const data = {
      //       lang: this.$store.getters.language || "cn",
      //       // type: "allChild",
      //       keys: ["G_ZY"],
      //       filter: {
      //           prefix: val,
      //           specilaCode: "XY2ZY"
      //       }
      //   };
      //   queryDic(data).then(res => {
      //       if (res.code === 200) this._fill("profession", res.data.G_ZY);
      //   });
    },
    _fill(type, data) {
      for (const key in data) {
        this.options[type].push({
            value: key,
            label: data[key]
        });
      }
    },
    // 获取列表
    postInternshipSet(data) {
      graduateStudent.postPracticeStatistic(data).then(res => {
        this.dataList = res.data.list;
        // this.queryForm.pageNum_ = res.data.pageNum_;
        // this.queryForm.pageSize_ = res.data.pageSize_;
        this.queryForm.total_ = res.data.total_;
        
      });
    },
    // 筛选
    onSearch() {
      this.queryForm.pageNum_ = 1;
      this.postInternshipSet(this.queryForm);
    },
    // 重置
    resetSearch() {
      for (let key in this.queryForm.condition) {
        this.queryForm.condition[key] = '';
      }
      this.queryForm.pageNum_ = 1;
      this.postInternshipSet(this.queryForm);
      
    },
    
    handleSelectionChange(val) {
      this.multipleSelection = val;
      // this.multipleSelection.every((item) => {
      //   if (item.status == 0 || item.status == 3) {
      //     return this.isAllDel = true;
      //   } else {
      //     this.isAllDel = false;
      //   }
      // })
    },
    
    
    handleSizeChange(val) {
      this.queryForm.pageNum_ = 1;
      this.queryForm.pageSize_ = val;
      this.postInternshipSet(this.queryForm);
    },
    handleCurrentChange(val) {
      this.queryForm.pageNum_ = val;
      this.postInternshipSet(this.queryForm);
    },
    reset() {
      for (const key in this.queryForm.condition) {
        if (key != 'calendarId') {
          this.queryForm.condition[key] = "";
        }
      }
      this.queryForm.pageNum_ = 1;
      this.postInternshipSet(this.queryForm);
    },
  }
  
}
</script>
<style lang="scss" scoped>
.condition-title {
  color: #2b3b4e;
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
}
  .edu-page-title {
    span {
      line-height: 24px;
      display: inline-block;
      padding-right: 10px;
      font-size: 18px;
      font-weight: bold;
      color: #2b3b4e;
    }
  }
  .sub-title {
    margin: 16px 0;
    font-size: 16px;
    color: #000020;
    letter-spacing: 0;
  }
  .form-item {
    width: 312px;
    height: 32px;
    float: left;
    margin: 0px 10px;
  }
  .inputBox{
    width: 240px!important;height: 32px!important;
  }
  .atooltip{
    background: beige;
    border: black;
  }
</style>
